import React, { Component } from "react";
import { withRouter } from "react-router-dom";
import { connect } from "react-redux";
import { updateProductAction } from "../../store/actionCreator";
import "./NewItemList.scss";
class NewItemList extends Component {
  state = {
    newItemList: [],
  };
  componentDidMount() {
    console.log("---------->", this.props);
    const list = this.props.bottomList;
    let row = [];
    for (let i = 0; i < 10; i++) {
      row.push(list.slice(i, i + 2));
      i += 2;
    }
    this.setState({
      //   newItemList:[list.slice(0, 2), list.slice(2, 4), list.slice(4, 6)]
      newItemList: row,
    });
  }
  
  render() {
    return (
      <div className="newItemListCon" style={{paddingTop:'0.1rem'}}>
        {this.state.newItemList &&
          this.state.newItemList.map((item, i) => (
            <div className="NewItemList" key={i}>
              {item.map((v) => (
                <div
                  className="NewItemListItem"
                  key={v.displaySkuId}
                  onClick={() => {
                    this.props.history.push("/ProductDetail/?id=" + v.id);
                  }}
                >
                  <img src={v.primaryPicUrl} alt="" />
                  <div className="newItemTitle">{v.name}</div>
                  <div className="newItemPrice">¥{v.retailPrice}</div>
                  <div className="newItemTag">
                    {v.itemTagList &&
                      v.itemTagList.map((val) => (
                        <span key={val.tagId + "-" + v.itemId}>{val.name}</span>
                      ))}
                  </div>
                </div>
              ))}
            </div>
          ))}
      </div>
    );
  }
}
const mapStateToProps = (state) => {
  return {
    productReducer: state.getIn(["productReducer"]),
  };
};
const mapDispatchToProps = (dispatch) => {
  return {
    updateProduct: (detail) => {
      dispatch(updateProductAction(detail));
    },
  };
};
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(NewItemList));
